<template>
	<div id="app">
		<router-view></router-view>
		<van-tabbar
			v-model="active"
			active-color="rgb(27, 174, 174)"
			@change="changeMenu"
			route
			v-if="showTabbar"
			placeholder
		>
			<van-tabbar-item
				v-for="item in menu"
				:key="item.path"
				:icon="item.icon"
				:to="item.path"
				:badge="item.path === '/cart' ? 0 : null"
			>
				{{ item.text }}
			</van-tabbar-item>
		</van-tabbar>
	</div>
</template>

<script>
export default {
	name: "App",
	data() {
		return {
			active: 0,
			showTabbar: true,
			menu: [
				{
					path: "/home",
					text: "首页",
					icon: "wap-home-o",
				},
				{
					path: "/classify",
					text: "分类",
					icon: "fire-o",
				},
				{
					path: "/cart",
					text: "购物车",
					icon: "shopping-cart-o",
				},
				{
					path: "/mine",
					text: "我的",
					icon: "user-o",
				},
			],
		};
	},
	computed: {
		// goodslist() {
		// 	// return this.$store.state.cartslist;
		// 	console.log(this.$store.state.goodslist);
		// 	if (this.$store.state.goodslist !== undefined)
		// 		return this.$store.state.goodslist;
		// },
	},
	methods: {
		changeMenu(active) {
			console.log(active);
		},
	},
};
</script>

<style>
.van-notify--danger {
	background-color: rgb(27, 174, 174) !important;
}
.van-button--danger {
	background: #000 !important;
}
.van-button--warning {
	background: rgb(190, 153, 255) !important;
	border-color: rgb(190, 153, 255) !important;
}
</style>
